<!--  -->
<template>
   <div class='newAddress'>
       <header-login @logn="loginTip"></header-login>
       <bread-nav><span slot="name">newAddress</span></bread-nav>
       <p>姓名：<input type="text" name="" id="" v-model.trim ="userName"></p>
       <p>地址：<input type="text" name="" id="" v-model.trim ="streetName"> </p>
       <p>电话：<input type="text" name="" id="" v-model.trim ="tel"></p>
       <p>邮编：<input type="text" name="" id="" v-model.trim ="postCode"></p>
       <p>是否为默认：<input type="checkbox" name="" id="" v-model="isDefault" value="isDefault" class="c"></p>
       <div><button type="button" @click="submitAddress">保存地址</button></div>
       <v-footer></v-footer>
   </div>
</template>

<script>
    import HeaderLogin from '@/components/HeaderLogin'
    import BreadNav from '@/components/BreadNav'
    import model from '@/components/model'
    import footer from '@/components/footer'
    export default {
       components: {HeaderLogin,BreadNav,model,"v-footer":footer},
       data() {
           return {
               "userName" : "",
                "streetName" : "",
                "postCode" : "",
                "tel" : "",
                "isDefault" : false,
                 "modelTip":{
                   tipText:"",
                   tipContent:"",
                   type:"",
                   showflg:false
               },
           };
       },
       computed: {
           isDefault01(){
               if(this.isDefault){
                   return 1;
               }else{
                   return 0;
               }
           }
       },
       watch: {},
       methods: {
           fztip(a,b,c,d){
                this.modelTip.tipText = a;
                this.modelTip.tipContent = b;
                this.modelTip.type = c;
           },
           fztip2(a,b,c,d){
                this.modelTip2.tipText = a;
                this.modelTip2.tipContent = b;
                this.modelTip2.type = c;
           },
           loginTip(param){
               switch (param.res) {
                   case "success":
                       this.fztip("正确",`${param.type}成功`,"success");
                       break;
                    case "err":
                        this.fztip("错误",param.type+"失败,请重新登录","err");
                        break;
                    case "tip":
                        this.fztip("警告",param.type,"tip");
                        break;
                    case "question":
                        this.fztip("问题",param.type,"question");
                        break;
                   default:
                       break;
               }
               this.modelTip.showflg = true;
            //   this.$refs.model.show();
           },
           submitAddress(){
                axios.post('/address/addAddress', {
                     "userName" : this.userName,
                    "streetName" : this.streetName,
                    "postCode" : this.postCode,
                    "tel" : this.postCode,
                    "isDefault" : this.isDefault01
                })
                .then(response => {
                    let {data,msg,errno} = response.data;
                    if(!errno){
                        console.log("保存成功");
                        this.$router.go(-1)
                    }
                })
                .catch(error => {
                    console.log(error);
                });
           }
       },
       created() {

       },
       mounted() {

       },
       beforeCreate() {}, //生命周期 - 创建之前
       beforeMount() {}, //生命周期 - 挂载之前
       beforeUpdate() {}, //生命周期 - 更新之前
       beforeDestroy() {}, //生命周期 - 销毁之前
       activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
    }
</script>
<style lang='less'>
    .newAddress{
        width:60%;
        margin: 50px auto 0;
        p{
            margin:15px;
            font-size:18px;
            text-align: center;
            input{
                min-width:180px;height: 30px;line-height: 30px;
            }
            .c{
                min-width:20px;
                height: 20px;line-height: auto;
                vertical-align: middle;
            }
        }
        div{
            text-align: center;
            button{
                padding: 15px 35px;
                background-color: brown;
                color: #fff;
                text-align: center;
            }
        }
    }
</style>